@extends('layouts/app')

@section('content')
    <div class="lineing">
        <div class="demos-content-padded">
            <h3 class="f22 gary9">用餐人数</h3>
            <div class="rooms-content people">
                <div class="btn active">
                    <p class="f18">2人</p>
                </div>
                <div class="btn">
                    <p class="f18">3人</p>
                </div>
                <div class="btn">
                    <p class="f18">4人</p>
                </div>
                <div class="btn">
                    <p class="f18">5人</p>
                </div>
                <div class="btn">
                    <p class="f18">6人</p>
                </div>
                <div class="btn">
                    <p class="f18">8人</p>
                </div>
                <div class="btn">
                    <p class="f18">10人以上</p>
                </div>
            </div>
        </div>
        <div class="demos-content-padded">
            <h3 class="f22 gary9">用餐时间</h3>
            <div class="rooms-content eat-time">
                <div class="btn active">
                    <p class="f18">12：00</p>
                </div>
                <div class="btn">
                    <p class="f18">12：00</p>
                </div>
            </div>
        </div>
        <div class="demos-content-padded">
            <h3 class="f22 gary9">位置选择</h3>
            <div class="rooms-content rooms">
                <div class="btn active" data-id="0">
                    <p class="f18">位置不限</p>
                </div>
                <div class="btn"  data-id="2">
                    <p class="f18">包间</p>
                </div>
                <div class="btn"  data-id="1">
                    <p class="f18">大厅</p>
                </div>
            </div>
        </div>

        <div class="check">
            <button class="weui-btn weui-btn_primary f30" onclick="addOrder()">提交</button>
        </div>
    </div>


    <script>
        var id = getRequest().id;

        // 按钮点击事件
        $(".lineing").on("click", ".btn", function () {
            var has = $(this).hasClass('active');

            if (has) {
                $(this).removeClass("active");
            } else {
                $(this).addClass("active").siblings().removeClass("active");
            }
        });

        // 排队时间

        // 获取当前时间（小时），并显示出来
        function getCurrentHours () {
            var nowDate = new Date();

            var cHours = nowDate.getHours();

            console.log("nowData", nowDate);
            console.log("cHours", cHours);
            var maxHours = 3,  // 步长
                lHours = cHours, // 时间段
                htmlText = [];

            for (var i = 0; i < maxHours; i++) {
                var fHours = cHours++,
                    sHours = ++lHours;
                if (i < 1) {
                    htmlText.push('<div class="btn active">');
                } else {
                    htmlText.push('<div class="btn">');
                }

                htmlText.push('<p class="f18">');
                htmlText.push(fHours + ':00 - ' + sHours + ':00');
                htmlText.push('</p>');
                htmlText.push('</div>');
            }

            $(".eat-time").html(htmlText.join(''))
        }
        getCurrentHours ();


        // 下单
        function addOrder () {
            var people = $(".people .btn.active").text().replace('人', '').trim(),
                eatTime = $(".eat-time .btn.active").text().trim(),
                room = $(".rooms .btn.active").text().trim(),
                roomId = $(".rooms .btn.active").attr('data-id');

            console.log("people", people);
            console.log("eatTime", eatTime);
            console.log("room", room);
            console.log("roomId", roomId);

            if (!people) {
                return $.toast('人数不能为空', 'text');
            }

            if (!eatTime) {
                return $.toast('时间不能为空', 'text');
            }

            if (!room) {
                return $.toast('位置不能为空', 'text');
            }
            var data = {};
            data['type'] = 	roomId;
            data['eat_time'] = 	getTimeinfo(eatTime);
            data['people'] = people;
            data['shop_id'] = id;

            $.post("/api/QaddOrder", data, function (res) {
                if (typeof res === 'string') {
                    res = JSON.parse(res);
                }

                $.toast(res.info, 'text');

                if (res.code == 200) {

                    location.href = '/mobile/payment?id=' + res.data.id + '&money=' + res.data.order_price + '&order_type=' + res.data.order_type;
                }
            });


        }

        function getTimeinfo (str) {
            var date = new Date(),
            year =  date.getFullYear(), //获取完整的年份(4位,1970-????)
            month =  date.getMonth(), //获取当前月份(0-11,0代表1月)
            day = date.getDate(); //获取当前日(1-31)

            var arr = str.split('-'),
                hours = arr[0].split(':')[0];

            console.log('arr', arr);
            console.log('hours', hours);

            var nDate = new Date(year, month, day, hours,0,0),
                timestamp = nDate.valueOf()

            console.log("nDate", typeof nDate.valueOf());

            return timestamp/1000;
        }
    </script>
    {{--<script>--}}
        {{--// 获取商家ID--}}
        {{--var shopsId = getRequest().shopsId,--}}
            {{--arriveTime = getRequest().arriveTime;--}}
        {{--console.log("arriveTime", arriveTime);--}}
        {{--// 根据ID拿到对应的数据--}}
        {{--function getRoomsData (shopsId) {--}}
            {{--// 拿到缓存的数据--}}
            {{--var rooms = Storage.get("rooms");--}}

            {{--if (rooms.status) {--}}
                {{--rooms = JSON.parse(rooms.value);--}}
                {{--console.log("rooms", rooms);--}}
                {{--var data = rooms[shopsId];--}}
            {{--}--}}
            {{--return data;--}}
        {{--}--}}
        {{--var data = getRoomsData(shopsId);--}}
        {{--playData(data); // 数据分类--}}

        {{--// 数据分类--}}
        {{--function playData (data) {--}}
            {{--var rooms = [], // 房间--}}
                {{--tables = [], // 桌子--}}
                {{--booths = [];  // 卡座--}}

            {{--for (var i = 0, len = data.length; i < len; i++) {--}}
                {{--// 如果是房间--}}
                {{--if (data[i].type == 0) {--}}
                    {{--tables.push(data[i]);--}}
                {{--} else if (data[i].type == 1) {--}}
                    {{--rooms.push(data[i]);--}}
                {{--} else {--}}
                    {{--booths.push(data[i]);--}}
                {{--}--}}
            {{--}--}}

            {{--// 渲染数据--}}
            {{--createHtml(rooms, ".rooms");--}}
            {{--createHtml(tables, ".tables");--}}
            {{--createHtml(booths, ".booths");--}}
        {{--}--}}

        {{--// 渲染数据--}}
        {{--@ param data 数据--}}
        {{--@ param ele html容器--}}
        {{--function createHtml(data, ele) {--}}
            {{--console.log("data1", data);--}}
            {{--console.log("ele", ele);--}}
            {{--var ldata = {};--}}
            {{--ldata['type'] = 'roomsList';--}}
            {{--ldata['element'] = ele;--}}
            {{--ldata['data'] = data;--}}

            {{--console.log("ldata", ldata);--}}
            {{--A.init(ldata);--}}
        {{--}--}}

        {{--// 点击房子桌子事件--}}
        {{--$(".booking").on("click", "div.btn", function () {--}}
            {{--var has = $(this).hasClass("active");--}}

            {{--// 点击一次是选择，再点一次就取消--}}
            {{--if (has) {--}}
                {{--$(this).removeClass("active");--}}
            {{--} else {--}}
                {{--$(this).addClass("active");--}}
            {{--}--}}
        {{--});--}}

        {{--// 去点菜--}}
        {{--function addOrder () {--}}
            {{--var btns = $(".booking .btn.active"),--}}
                {{--len = btns.length;--}}
            {{--console.log("len", len);--}}

            {{--// 拿到所有选择的项目--}}
            {{--var deskRoom = "";--}}
            {{--btns.each(function (index, value) {--}}
                {{--// 拿到ID--}}
                {{--var id = $(this).attr("data-id");--}}

                {{--if (index < len - 1) {--}}
                    {{--deskRoom += id + "|";--}}
                {{--} else {--}}
                    {{--deskRoom += id;--}}
                {{--}--}}
                {{--console.log("id", id);--}}
            {{--});--}}
            {{--location.href = "/mobile/takeout-menu?id=" + shopsId + "&type=book" + "&arriveTime=" + arriveTime + "&desk_room=" + deskRoom;--}}
            {{--console.log("deskRoom", deskRoom);--}}
        {{--}--}}
    {{--</script>--}}

@endsection


@extends('layouts/footer')
